<template>
	<view>
		<u-navbar :is-back="true" title="2021届会明最受欢迎网红评选海选"></u-navbar>
		<view class="huodong-cont">
			<image src="../../../static/img/acitivity/activity-img.jpg" class="xuanchuantu"></image>
			<view class="huodong-jbxx">
				<view class="jbxx-cont">
					<view class="title u-font-28 color5">2021届会明最受欢迎网红评选海选</view>
					<view class="date u-font-24">活动时间：2021-04-18 14:00</view>
				</view>
				<view class="statu">
					<text class="u-font-24 zanting">活动已暂停</text>
				</view>
			</view>
		</view>
		<view class="guanli-btn">
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/bianji.png" class="btn-icon"></image>
				<text class="btn-name">编辑</text>
			</view>
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/zanting2.png" class="btn-icon"></image>
				<text class="btn-name">投票已暂停</text>
			</view>
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/shanchu.png" class="btn-icon"></image>
				<text class="btn-name">删除</text>
			</view>
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/xuanshou.png" class="btn-icon"></image>
				<text class="btn-name">选手管理</text>
			</view>
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/tpzs.png" class="btn-icon"></image>
				<text class="btn-name">投票总数</text>
			</view>
			<view class="guanli-btn-list">
				<image src="../../../static/img/acitivity/zhibojian.png" class="btn-icon"></image>
				<text class="btn-name">活动直播</text>
			</view>
		</view>
		<tarBer :totarBer='tar'></tarBer>
	</view>
</template>

<script>
	import tarBer from '../../../components/tabBarFoot/tabBarFoot.vue'
	export default {
		components:{
				 tarBer
			 },
		data() {
			return {
				tar:{
						color:'#fff',
						id:1		 
				},
			};
		}
	}
</script>

<style lang="scss">
page{
	background-color: #e3e3e3;
}
.huodong-cont{
	background-color: #FFFFFF;
	padding: 30rpx 35rpx 0rpx;
	.xuanchuantu{
		width: 100%;
		height: 343rpx;
	}
	.huodong-jbxx{
		display: flex;
		justify-content: space-between;
		padding: 30rpx 0 40rpx;
		.jbxx-cont{
			.date{
				color: #8e908f;
				margin-top: 10rpx;
			}
		}
		.zanting{
			color: #7b7b7b;
		}
	}
}
.guanli-btn{
	margin: 40rpx 30rpx;
	background-color: #FFFFFF;
	border-radius: 20rpx;
	display: flex;
	flex-wrap: wrap;
	.guanli-btn-list{
		width: 33%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin: 54rpx 0 46rpx;
		.btn-icon{
			width: 45rpx;
			height: 45rpx;
		}
		.btn-name{
			color: #545454;
			font-size: 24rpx;
			margin-top: 10rpx;
		}
	}
}
</style>
